<template>
	<view class="management">
		<!-- <scroll-view scroll-y="true"> -->
		<HeaderNav bgcolor='#56677c' text='' :showNavBackBtn='false' color='transparent'></HeaderNav>
		
		<view class="management-container">
			<view class="top-nav">
				<van-tabs class="tags" active="a" color="#fff">
					<van-tab class="item" title="产品" name="a">
						<scroll-view scroll-y="true" class="swiper">
							<AddBtn :tab='0' />
							<view class="dd">
								<NullData v-show="goodsList.length==0" />
							</view>
							<Product v-show="goodsList!=null" :goodsList="goodsList"></Product>
						</scroll-view>
					</van-tab>
					<van-tab class="item" title="排产" name="b">
						<scroll-view scroll-y="true" class="swiper">
							<AddBtn :tab='1' />
							<view class="dd">
								<NullData v-show="allRecords.length==0" />
							</view>
							<!-- {{ cid }} -->
							<ProductScheduling 
								v-show="allRecords!=null" 
								:goodsList="goodsList" 
								:allRecords="allRecords">
							</ProductScheduling>
						</scroll-view>
					</van-tab>
					<van-tab class="item" title=" " disabled name="c">
					</van-tab>
				</van-tabs>
			</view>
			
		</view>
	</view>
</template>

<script>
	import HeaderNav from '@/common/HeaderNav/HeaderNav'
	import NullData from '@/common/NullData1/NullData'
	import Product from './components/product'
	import ProductScheduling from './components/ProductScheduling'
	import AddBtn from './components/AddBtn'
	
	import { getAllGoods as getGoodsAllApi } from '@/api/goods'
	import { getAllRecords as getAllRecordsApi } from '@/api/emission'
	
	export default {
		data() {
			return {
				active: 1,
				cid: 0,
				goodsList: [],
				allRecords: [],
				goodsInfo: []
			}
		},
		onShow() {
			this.cid=this.$store.getters.getUser.cid
			if(this.cid==null || this.cid==0) {
				uni.navigateTo({
					url: '../login/login'
				})
			}else {
				this._getGoodsList()
				this.__getAllRecords()
			}
		},
		created() {
			this.cid=this.$store.getters.getUser.cid
		},
		components: {
			HeaderNav,
			NullData,
			Product,
			AddBtn,
			ProductScheduling
		},
		methods: {
			async _getGoodsList() {
				const data = {
					cid: this.cid
				}
				
				const res = await getGoodsAllApi(data)
				this.goodsList = res.data
				
				// res.data.forEach(function(element, index, array) {
				// 	let obj={
				// 		gid: element.gid,
				// 		sname: element.sname,
				// 		unit: element.unit
				// 	}
				// 	// this.goodsInfo.push(obj)
				// 	console.log('goodsInfo: ',obj)
				// });
				
			},
			async __getAllRecords() {
				const data={
					cid: this.cid
				}
				
				const res=await getAllRecordsApi(data)
				// console.log(res.data)
				if(res.data != null) {
					this.allRecords=res.data
					// console.log("AllRecords: ", this.allRecords)
				}else {
					uni.showToast({
						icon: 'error',
						title: '接口请求失败',
						duration: 3000
					})
				}
			},
			onChange(event) {
				uni.showToast({
					title: `切换到标签 ${event.detail.name}`,
					icon: 'none',
				})
			}

		},

	}
</script>

<style lang="less" scoped>
	scroll-view {
		// height: 100vh;
		box-sizing: border-box;
		// background: linear-gradient(0deg, #021B79, #0b2997, #254dd3);
		background: linear-gradient(to top,#172349,#1d2e55,#203f5f,#4f5e72);
		// background: linear-gradient(to top,#1d2e55,#203f5f,#4f5e72,#68819a);
	}

	.management {
		width: 100vw;
		height: 100vh;
		// padding: 20rpx;
		padding-top: 160rpx;
		box-sizing: border-box;
		// background: linear-gradient(0deg, #021B79, #0b2997, #254dd3);
		
		.management-container {
			height: 100%;
			
			.top-nav {
				position: fixed;
				top: 70rpx;
				left: 0rpx;
				width: 100%;
				// height: 160rpx;
				// background-color: white;
				z-index: 999;
				background-color: rgba(255, 255, 255, .1);
			
				.tags {
					background-color: rgba(255, 255, 255, .1);
			
					.item {
						// height: 100%;
						// text-align: center;
						
						.swiper {
							padding: 0 20rpx;
							padding-right: 20rpx;
							
							.dd {
								// margin-top: 400rpx;
							}
						}
					}
				}
		}
		}
		
	}
</style>
